<!DOCTYPE html>
<html lang="zh-cmn-Hans" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="css/iconfont.css">
    <link rel="stylesheet" href="css/global.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/styles.css">
    <script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
    <script src="js/bootstrap.min.js" charset="UTF-8"></script>
    <script src="js/swiper.min.js" charset="UTF-8"></script>
    <script src="js/global.js" charset="UTF-8"></script>
    <script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
    <title>农资商贸销售系统</title>
</head>
<body>
<!-- 顶部tab -->
<div th:replace="~{mall/common :: header}"></div>

<div class="content clearfix bgf5">
    <section class="user-center inner clearfix">
        <div class="user-content__box clearfix bgf">
            <div class="title">购物车-确认支付</div>
            <div class="shop-title">收货地址</div>
            <form action="" class="shopcart-form__box">
                <div class="addr-radio">
                    <div th:each="address : ${useradressList}"
                         th:class="${address.dedaultadress == 1? 'radio-line radio-box active' : 'radio-line radio-box'}">
                        <label class="radio-label ep"
                               th:title="${address.shprovince + ' ' + address.shcity + ' ' + address.district + ' ' + address.shstreet + ' ' + address.shjaddress + ' (' + address.shname + '收) ' + address.shphone}">
                            <input name="addressid" th:value="${address.id}"
                                   th:checked="${address.dedaultadress == 1}" autocomplete="off" type="radio"><i
                                class="iconfont icon-radio"></i>
                            <span th:text="${address.shprovince + ' ' + address.shcity + ' ' + address.district + ' ' + address.shstreet + ' ' + address.shjaddress + ' (' + address.shname + '收) ' + address.shphone}"></span>
                        </label>
                        <a href="javascript:;" class="default" th:if="${address.dedaultadress == 1}">默认地址</a>
                        <a onclick="setDefault(this)" th:if="${address.dedaultadress == 2}">设为默认地址</a>
                        <a th:href="@{'userAddressEdit?id=' + ${address.id}}" class="edit">修改</a>
                    </div>
                </div>
                <div class="add_addr"><a href="userAddress">添加新地址</a></div>
                <script>
                    //设为默认地址
                    function setDefault(obj) {
                        let id = $(obj).parent().find('input').val();
                        if (!id) {
                            DJMask.open({
                                width: "300px",
                                height: "100px",
                                content: "未获取到数据，请刷新页面试试！！！"
                            })
                            return false;
                        }
                        $.ajax({
                            type: 'post',
                            url: '/mall/useradress/update',
                            data: {id, dedaultadress: 1},
                            success: function (res) {
                                if (res.code === 200) {
                                    DJMask.open({
                                        width: "300px",
                                        height: "100px",
                                        content: res.msg
                                    })
                                    //倒计时一秒刷新当前页面
                                    setTimeout(function () {
                                        window.location.reload();
                                    }, 1000);
                                } else if (res.code === 401) {
                                    DJMask.open({
                                        width: "300px",
                                        height: "100px",
                                        content: res.msg + "，将在三秒后自动跳转到登录页面"
                                    })
                                    //倒计时三秒跳转到登录页面
                                    setTimeout(function () {
                                        window.location.href = "/mall/login";
                                    }, 3000);
                                } else {
                                    DJMask.open({
                                        width: "300px",
                                        height: "100px",
                                        content: res.msg
                                    })
                                }
                            }
                        })
                    }
                </script>
                <div class="shop-title">确认订单</div>
                <div class="shop-order__detail">
                    <table class="table">
                        <thead>
                        <tr>
                            <th width="120"></th>
                            <th width="300">商品信息</th>
                            <th width="150">单价</th>
                            <th width="200">数量</th>
                            <th width="200">总价</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="orderDetail : ${orderdetailList}">
                            <th scope="row"><a th:href="@{'goodsDetail?id=' + ${orderDetail.goodsid}}">
                                <div class="img"><img th:src="${orderDetail.img}" alt="" class="cover"></div>
                            </a></th>
                            <td>
                                <div class="name ep3" th:text="${orderDetail.goodsname}"></div>
                                <div class="type c9" th:text="${orderDetail.describe}"></div>
                            </td>
                            <td th:text="${'¥'+orderDetail.goodsprice}"></td>
                            <td th:text="${orderDetail.num}"></td>
                            <td th:text="${'¥'+orderDetail.sumprice}"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="shop-cart__info clearfix">
                    <div class="pull-left text-left">
                        <div class="info-line text-nowrap">下单时间：<span class="c6" th:text="${orderTime}"></span>
                        </div>
                        <div class="info-line text-nowrap">订单号：<span class="c6" th:text="${order.orderid}"></span>
                        </div>
                    </div>
                    <div class="pull-right text-right">
                        <div class="info-line">合计：<b class="fz18 cr" th:text="${'¥'+order.sumprice}"></b></div>
                    </div>
                </div>
                <div class="orderid" id="orderid" style="display: none;" th:text="${order.id}"></div>
                <div class="user-form-group shopcart-submit">
                    <button type="button" onclick="payOrder()" class="btn">支付</button>
                </div>
                <script>
                    //支付
                    function payOrder() {
                        let orderid = $('#orderid').text();
                        if (!orderid) {
                            DJMask.open({
                                width: "300px",
                                height: "100px",
                                content: "未获取到数据，请刷新页面试试！！！"
                            })
                            return false;
                        }
                        //获取选中的收货地址
                        let adressid = $('input[name="addressid"]:checked').val();
                        if (!adressid) {
                            DJMask.open({
                                width: "300px",
                                height: "100px",
                                content: "请选择收货地址！！！"
                            })
                            return false;
                        }
                        if (!confirm('确认支付？')) {
                            return false;
                        }
                        window.location.href = "/mall/alipay/pay?id=" + orderid + "&state=" + 3 + "&adressid=" + adressid ;
                        // $.ajax({
                        //     type: 'post',
                        //     url: '/mall/order/update',
                        //     data: {id: orderid, state: 3,adressid},
                        //     success: function (res) {
                        //         if (res.code === 200) {
                        //             DJMask.open({
                        //                 width: "300px",
                        //                 height: "100px",
                        //                 content: "支付成功！！！"
                        //             })
						// 			//倒计时1秒跳转到订单页面
						// 			setTimeout(function () {
						// 				window.location.href = "/mall/userOrder";
						// 			}, 1000);
                        //         } else if (res.code === 401) {
                        //             DJMask.open({
                        //                 width: "300px",
                        //                 height: "100px",
                        //                 content: res.msg + "，将在三秒后自动跳转到登录页面"
                        //             })
                        //             //倒计时三秒跳转到登录页面
                        //             setTimeout(function () {
                        //                 window.location.href = "/mall/login";
                        //             }, 3000);
                        //         } else {
                        //             DJMask.open({
                        //                 width: "300px",
                        //                 height: "100px",
                        //                 content: res.msg
                        //             })
                        //         }
                        //     },
                        //     error: function (res) {
                        //         DJMask.open({
                        //             width: "300px",
                        //             height: "100px",
                        //             content: "网络繁忙请稍后再试！！！"
                        //         })
                        //     }
                        // })
                    }
                </script>
            </form>
        </div>
    </section>
</div>

<!-- 右侧菜单 -->
<div th:replace="~{mall/common :: rightNav}"></div>
<!-- 底部信息 -->
<div th:replace="~{mall/common :: footer}"></div>
</body>
</html>